<?php require VIEWPATH . ADMIN_DIR . DIRECTORY_SEPARATOR . 'sub' . DIRECTORY_SEPARATOR .'header.php'?>
<style>
	#cboxClose {
		text-indent: 0;
		font-size: 50px;
		font-weight: bold;
		margin-top: 10px;
		color: red;
    }
    
    /* 隐藏选择条数 */
    .dataTables_wrapper .row:first-child{display: none;}
</style>
<div class="ant-card page-wrap com-card static-page___2-4kT">
    <div class="ant-card-head">
        <div class="ant-card-head-wrapper">
            <div class="ant-card-head-title">信息发布列表</div>
        </div>
    </div>
    <div class="outer-table">
        <div>
            <a href="<?=admin_url('sub/cms/article_edit')?>" class="btn-send">发布文章</a>    
        </div>
        <!-- 学校表格 -->
        <table id="dynamic-table" class="table table-bordered table-hover mt10">
            <thead>
                <tr>
                    <th>文章封面</th>
                    <th>文章标题</th>
                    <th>所属栏目</th>
                    <th>排序</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
</div>
<!-- 删除弹窗 -->
<div id="modal-delete" class="modal fade">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header no-padding">
				<div class="table-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						<span class="white"><img src="<?=$staticAdminUrl?>sub/assets/img/cms/no.png" style="height:18px;width:18px;"></span>
					</button>
					信息
				</div>
			</div>
			<div class="modal-body no-padding">
				<input type="hidden" name="delete_id" />
				<div class="row">
					<div class="col-xs-12">
						<div class="outer-tip">
							<div>
								<img src="<?=$staticAdminUrl?>sub/assets/img/cms/warn.png" alt="">
							</div>
							<div class="tip col-xs-12">确定要删除该文章吗？</div>
						</div>
						
					</div>
				</div>
			</div>
			<div class="modal-footer no-margin-top">
				<a href="javascript:;" class="cancel" data-dismiss="modal" aria-hidden="true">取消</a>
				<a href="javascript:;" class="delete-article">确定</a>
			</div>
		</div>
	</div>
</div>
<?php require VIEWPATH . ADMIN_DIR . DIRECTORY_SEPARATOR . 'sub' . DIRECTORY_SEPARATOR .'footer.php'?>
<script>
$(function() {
    var table =$('#dynamic-table').dt_hzy({
        "ajaxUrl": '<?=admin_url('cms/get_article_list')?>',
        "columns": [
            {"data": function(ret){
                return '<div class="ace-thumbnails"><a href="' + ret.article_cover + '" data-rel="colorbox" class="cboxElement"><img src="' + ret.article_cover + '!thumb" width="64"/></a></div>';
            }},
            {"data": "article_title"},
            {"data": "categoryName"},
            {"data": "article_sort"},
            {"data": function(ret){
                var action = '';
                action += '<a class="a-edit mr20" href="<?=admin_url('sub/cms/article_edit')?>/'+ ret.id +'">修改</a>';
                action += '<a class="a-delete" href="#modal-delete" data-toggle="modal" class="ml20 text-danger delete-article" data-id="'+ ret.id +'">删除</a>';
                return action;
            }},
        ]
    });
    // 显示删除弹窗
    $("body").on("click", ".a-delete", function(){
        var id = $(this).data("id");
        $("[name=delete_id]").val(id);
    });
    // 删除文章
    $("body").on("click", ".delete-article", function(e){
        var id = $("[name=delete_id]").val();
        // 提交数据
        var postUrl = "<?=admin_url('cms/delete_article_action')?>";
        var postData = {"id": id};
        ajax_post(postUrl, postData, function(res){
            window.location.reload();
        })
    });
    // 图片轮播
    var colorbox_params = {
        rel: 'colorbox',
        reposition:true,
        scalePhotos:true,
        scrolling:false,
        previous:'<i class="ace-icon fa fa-arrow-left"></i>',
        next:'<i class="ace-icon fa fa-arrow-right"></i>',
        close:'&times;',
        // close:'<i class="ace-icon fa fa-times"></i>',
                // close:'a',
        current:'',
        maxWidth:'100%',
        maxHeight:'100%',
        onOpen:function(){
            $overflow = document.body.style.overflow;
            document.body.style.overflow = 'hidden';
        },
        onClosed:function(){
            document.body.style.overflow = $overflow;
        },
        onComplete:function(){
            $.colorbox.resize();
        }
    };
    setTimeout(() => {
        $('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
    }, 100);
    setTimeout(() => {
        $('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
    }, 1000);
    setTimeout(() => {
        $('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
    }, 2000);
    setTimeout(() => {
        $('.ace-thumbnails [data-rel="colorbox"]').colorbox(colorbox_params);
    }, 3000);

    // 自定义‘显示条数’
    $("body").on("click", ".paginate_button ", function(){
        setTimeout(() => {
            var t = ($(".dataTables_info").html());
            var h = "<span class='page-count' style='color:#666666;font-size:12px;position:relative; top:-7px'>" + t + "</span>";
            if(t != '' && $("#dynamic-table_paginate").find(".page-count").length === 0) {
                $(".pagination").before(h);
            }
        }, 100);
        setTimeout(() => {
            var t = ($(".dataTables_info").html());
            var h = "<span class='page-count' style='color:#666666;font-size:12px;position:relative; top:-7px'>" + t + "</span>";
            if(t != '' && $("#dynamic-table_paginate").find(".page-count").length === 0) {
                $(".pagination").before(h);
            }
        }, 200);
        setTimeout(() => {
            var t = ($(".dataTables_info").html());
            var h = "<span class='page-count' style='color:#666666;font-size:12px;position:relative; top:-7px'>" + t + "</span>";
            if(t != '' && $("#dynamic-table_paginate").find(".page-count").length === 0) {
                $(".pagination").before(h);
            }
        }, 300);
        setTimeout(() => {
            var t = ($(".dataTables_info").html());
            var h = "<span class='page-count' style='color:#666666;font-size:12px;position:relative; top:-7px'>" + t + "</span>";
            if(t != '' && $("#dynamic-table_paginate").find(".page-count").length === 0) {
                $(".pagination").before(h);
            }
        }, 1000);
    })
})
</script>